<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html rsf:id="html" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<META HTTP-EQUIV="CACHE-CONTROL" CONTENT="NO-CACHE"/>
<script rsf:id="scr=portal-matter"src="/library/js/headscripts.js"></script>
<link rsf:id="scr=portal-matter" href="/library/skin/tool_base.css" type="text/css" rel="stylesheet" media="all" />
<link rsf:id="scr=portal-matter" href="/library/skin/default-skin/tool.css" type="text/css" rel="stylesheet" media="all" />
<title rsf:id="msg=simplepage.blti.chooser"></title>
<style>
.ui-widget-overlay.ui-front {
    opacity:.75;
}
</style>
</head>
<body rsf:id="scr=sakai-body">
	<div class="portletBody" id="portletBody">
		<div rsf:id="error-div" class="ui-widget">
			<div class="sak-banner-error below-link-help">
				<p><span rsf:id="error"></span></p>
			</div>
		</div>

		<form action="#" rsf:id="blti-autosubmit" id="blti-autosubmit">
			<input type="hidden" rsf:id="csrf"/>
			<input type="hidden" rsf:id="item-id" id="item-id" />
			<input type="hidden" rsf:id="select"/>
			<input type="hidden" rsf:id="add-before" id="add-before" />
			<input type="hidden" rsf:id="item-description" id="item-description" />
			<input type="hidden" class="bold" rsf:id="submit" />
		</form>


		<form action="#" rsf:id="blti-cancel" id="blti-cancel">
			<input type="hidden" rsf:id="csrf"/>
			<input type="hidden" rsf:id="cancel2"/>
		<a rsf:id="blti-launch-link" href="#" id="blti-launch-link" class="btn btn-primary" target="sakai-lti-admin-iframe" onclick="showIframe();">
			<span rsf:id="blti-select-text" class="blti-select-text" id="blti-select-text"></span>
        </a>
			<input type="submit" rsf:id="cancel" class='cancelButton'/>
		</form>

    <div id="modal-iframe-div" class="modal fade" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" aria-labelledby="bltiModalLabel" aria-hidden="true">
      <div id="blti-dialog" class="modal-dialog">
        <div class="modal-content">
          <div class="modal-header">
            <h5 class="modal-title" id="bltiModalLabel">Modal title</h5>
            <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
          </div>
          <div class="modal-body">
			      <iframe name="sakai-lti-admin-iframe" id="sakai-lti-admin-iframe" src="/library/image/sakai/spinner.gif" tabindex="0"></iframe>
          </div>
        </div>
      </div>
    </div>

	</div>

  <script>
  includeLatestJQuery('BltiPicker.html');
  </script>

  <script>
    //<![CDATA[
    function showIframe() {
      let title = document.getElementById('blti-select-text').textContent;
      document.getElementById("bltiModalLabel").innerHTML = title;

      const el = document.getElementById("modal-iframe-div");
      const modal = bootstrap.Modal.getOrCreateInstance(el);

      el.addEventListener("shown.bs.modal", e => {
        console.log('Height', modalDialogHeight());
        $('#modal-iframe-div').attr('height', modalDialogHeight());
        $('#sakai-lti-admin-iframe').attr('width', $("#modal-iframe-div").width());
        $('#sakai-lti-admin-iframe').attr('height', modalDialogHeight()-50);
      });

      el.addEventListener("hidden.bs.modal", e => {
          $('#sakai-lti-admin-iframe').attr('src','/library/image/sakai/spinner.gif');
          var form = document.getElementById("blti-cancel");
          if ( form != null ) {
              console.debug("Cancelling");
              form.submit();
          }
      });
      modal.show();

      $(window).resize(function() {
        modal.handleUpdate();
        // Note that width() gives the content width, taking into consideration the border, padding, etc.
        console.log('Height', modalDialogHeight());
        $('#sakai-lti-admin-iframe').attr('width', $("#modal-iframe-div").width());
        $('#sakai-lti-admin-iframe').attr('height', modalDialogHeight()-50);
      });
    }


$( document ).ready(function() {
		// If we have the blti-autosubmit form, submit it therwise show picker
		setTimeout(function(){
			var form = document.getElementById("blti-autosubmit");
            if ( form != null ) {
                form.submit();
            } else {
                console.debug("There is no form to submit");
                var shortcut_tag = document.getElementById('blti-launch-link');
                if ( shortcut_tag ) {
                    var shortcut_href = shortcut_tag.getAttribute('href');
                    if ( shortcut_href ) {
                        document.getElementById('sakai-lti-admin-iframe').src = shortcut_href;
                        showIframe();
                    }
                }
            }
			}, 250);
//]]>
});
</script>


</body>
</html>
